<!doctype html>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/modules/cms/front/include/taglib.jsp"%>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>山东省林业厅</title>
    <meta name="description" content="">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="${ctxStatic}/sdlyfp/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="${ctxStatic}/sdlyfp/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="${ctxStatic}/sdlyfp/css/amazeui.min.css" />
    <link rel="stylesheet" href="${ctxStatic}/sdlyfp/css/admin.css">
    <link rel="stylesheet" href="${ctxStatic}/sdlyfp/css/app.css">
    <script src="${ctxStatic}/sdlyfp/js/echarts.min.js"></script>
</head>

<body data-type="chart">
    
<!-- head -->
<jsp:include page="head.jsp" flush="false"></jsp:include>

   <div class="tpl-page-container tpl-page-header-fixed">
   
<!-- 菜单 -->
<jsp:include page="menu.jsp" flush="false"></jsp:include>


   <div class="tpl-content-wrapper">
       <div class="tpl-content-page-title">
                          全省林业扶贫进度统计表
                 
    <c:if test="${fns:getUser().area.type gt 2}">
       &nbsp;<font style="font-size: 17px;" color="red"><b>温馨提示：</b>
       	该列表展示的是登录操作员所在单位的下级单位各个项目的进度柱状图，省、地市可以查看各个地市的进度，
       	区县可以查看各个地市区县的进度（同级单位可以互看）；当选择科技下乡时，省、地市只展示自己的
       	科技下乡活动进度（省：2次，地市：4次，区县则根据村覆盖率统计）；当选择技术明白人时，每个单位会同时展示
       	县技术专家（5名）、乡镇技术员（3名）和村技术明白人（1名）进度。<b>注意</b>：当下级单位过多时，
       	由于太宽造成柱状图下面的单位名称显示不全，此时可以缩小浏览器显示比例并重新查询。</font>
     </c:if>
       	
</div>
<ol class="am-breadcrumb">
    <li><a href="#" class="am-icon-home">首页</a></li>
    <li><a href="#">统计报表</a></li>
    <li class="am-active">分项统计表</li>
</ol>
<div class="tpl-portlet-components">
    <div class="portlet-title">
        <div class="caption font-green bold">
                               分项统计表
        </div>
        <div class="tpl-portlet-input tpl-fz-ml">
            <div class="portlet-input input-small input-inline">
                
            </div>
        </div>
    </div>
    
    <div class="tpl-block">
    
    <form action="${ctx }/gt/gtAnalysis/chart" method="post">
	<input type="hidden" id="areaType" name="type" value="${area.type }"/>

  <div class="am-g">
      
      <div class="am-u-sm-12 am-u-md-6">
          <div class="am-form-group">
              <select name="category" data-am-selected="{btnSize: 'sm'}" onchange="querySubAreaDate(document.getElementById('code'));"> 
			 <option value="forest" ${category eq 'forest' ? 'selected':''}>经济林扶贫</option>
			 <option value="country" ${category eq 'country' ? 'selected':''}>科技下乡</option>
			 <%-- <option value="train" ${category eq 'train' ? 'selected':''}>技术培训</option> --%>
			 <option value="tecClear" ${category eq 'tecClear' ? 'selected':''}>技术明白人</option>
			 <option value="post" ${category eq 'post' ? 'selected':''}>护林员岗位扶贫</option>
			 <option value="company" ${category eq 'company' ? 'selected':''}>龙头企业（合作社）扶贫</option>
			 <%-- <option value="policy" ${category eq 'policy' ? 'selected':''}>林业政策扶贫</option> --%>
			</select>

           </div>
       </div>

<!-- 区县及以下账号时，才展示地市   同级之间可以查看进度，所以省级和地市级账号登陆都无需选择地市 -->

  <div class="am-u-sm-12 am-u-md-6">
     <div class="am-form-group" style="float:left">
                        
	<select id="code" name="code" data-am-selected="{btnSize: 'sm'}" onchange="querySubAreaDate(this);">
	<!-- 县级以上账号才显示全国 -->
	<c:if test="${fns:getUser().area.type lt 4}">
	 <option value="sd" areaType="2">全省</option>
	</c:if>
	 <!-- <option value="option2">济南市</option> -->
	 <c:forEach items="${regions }" var="region">
	 	<option value="${region.code }" ${area.code eq region.code ? 'selected':''} areaType="${region.type }">${region.name }</option>
	 </c:forEach>
	 </select>
	</div>
  </div>
       
   </div>
   </form>


   <!--此部分数据请在 js文件夹下中的 app.js 中的 “百度图表A” 处修改数据 插件使用的是 百度echarts-->

  <div class="tpl-echarts tpl-chart-mb" id="tpl-echarts-C">

  </div>
  
  <!-- 省级管理员时，展示表格 -->
  <c:if test="${fns:getUser().area.type lt 3}">
    <c:if test="${category eq 'forest'}">
		<table class="chartT" width="100%" style="text-align:center;   font-size:14px; line-height:20px">											
			<thead>
			<tr>
				<td>单位</td>
				<c:forEach items="${forestRegionList }" var="region" varStatus="stat">
				<td>${region.name }</td>
				</c:forEach>
			</tr>
			</thead>
			
			<tr>
				<td>经济林帮扶面积（%）</td>
				<c:forEach items="${forestRegionList }" var="region" varStatus="stat">
				<td>${region.realArea }<br/>(${region.forestRate }%)</td>
				</c:forEach>
			</tr>
			<tr>
				<td>经济林帮扶人数（%）</td>
				<c:forEach items="${forestRegionList }" var="region" varStatus="stat">
				<td>${region.realPeople }<br/>(${region.peopleRate }%)</td>
				</c:forEach>
			</tr>
      </table>
    </c:if>
    
    <c:if test="${category eq 'country'}">
		<table class="chartT" width="100%" style="text-align:center;   font-size:14px; line-height:20px">											
			<thead>
			<tr>
				<td>单位</td>
				<c:forEach items="${countryRegionRate }" var="region" varStatus="stat">
				<td>${region.name }</td>
				</c:forEach>
			</tr>
			</thead>
			
			<tr>
				<c:if test="${area.type lt 3}">
					<td>市级次数（%）</td>
				</c:if>
				<c:if test="${area.type eq 3}">
					<td>县级覆盖村数（%）</td>
				</c:if>
				<c:forEach items="${countryRegionRate }" var="region" varStatus="stat">
					<td>
					<c:if test="${area.type lt 3}">
					${region.realCountryInfo }
					</c:if>
					<c:if test="${area.type eq 3}">
					${region.countryCoverReal }
					</c:if>
					
					<br/>(${region.countryRate }%)</td>
				</c:forEach>
			</tr>
			<!-- 省级以上才展示县级覆盖村数 -->
			<c:if test="${area.type lt 3}">
				<tr>
					<td>县级覆盖村数（%）</td>
					<c:forEach items="${countryRegionRate }" var="region" varStatus="stat">
					<td>${region.countryCoverReal }<br/>(${region.countryCoverRate }%)</td>
					</c:forEach>
				</tr>
			</c:if>
      </table>
    </c:if>
    
    <c:if test="${category eq 'post'}">
		<table class="chartT" width="100%" style="text-align:center;   font-size:14px; line-height:20px">											
			<thead>
			<tr>
				<td>单位</td>
				<c:forEach items="${postRegionList }" var="post" varStatus="stat">
				<td>${post.name }</td>
				</c:forEach>
			</tr>
			</thead>
			<tr>
				<td>护林员岗位帮扶人数（%）</td>
				<c:forEach items="${postRegionList }" var="post" varStatus="stat">
				<td>${post.realPeople }<br/>(${post.rate }%)</td>
				</c:forEach>
			</tr>
      </table>
    </c:if>
    
    <c:if test="${category eq 'tecClear'}">
		<table class="chartT" width="100%" style="text-align:center;   font-size:14px; line-height:20px">											
			<thead>
			<tr>
				<td>单位</td>
				<c:forEach items="${countryRegionRate }" var="region" varStatus="stat">
				<td>${region.name }</td>
				</c:forEach>
			</tr>
			</thead>
			
			<tr>
				<td>县技术专家（%）</td>
				<c:forEach items="${countryRegionRate }" var="region" varStatus="stat">
				<td>${region.realClear }<br/>(${region.clearRate }%)</td>
				</c:forEach>
			</tr>
			<tr>
				<td>乡镇技术员（%）</td>
				<c:forEach items="${countryRegionRate }" var="region" varStatus="stat">
				<td>${region.realTownClear }<br/>(${region.clearTownRate }%)</td>
				</c:forEach>
			</tr>
			<tr>
				<td>村技术名人（%）</td>
				<c:forEach items="${countryRegionRate }" var="region" varStatus="stat">
				<td>${region.realCountryClear }<br/>(${region.clearCountryRate }%)</td>
				</c:forEach>
			</tr>
      </table>
    </c:if>
    
    <c:if test="${category eq 'company'}">
		<table class="chartT" width="100%" style="text-align:center;   font-size:14px; line-height:20px">											
			<thead>
			<tr>
				<td>单位</td>
				<c:forEach items="${companyRegionRate }" var="company" varStatus="stat">
				<td>${company.name }</td>
				</c:forEach>
			</tr>
			</thead>
			<tr>
				<td>龙头企业数量（%）</td>
				<c:forEach items="${companyRegionRate }" var="company" varStatus="stat">
				<td>${company.realCompany }<br/>(${company.rate }%)</td>
				</c:forEach>
			</tr>
			<tr>
				<td>合作社帮扶人数</td>
				<c:forEach items="${companyRegionRate }" var="company" varStatus="stat">
				<td>${company.peopleCount }</td>
				</c:forEach>
			</tr>
      </table>
    </c:if>
    
	</c:if>
                
      </div>
    </div>

</div>

    </div>


    <script src="${ctxStatic}/sdlyfp/js/jquery.min.js"></script>
    <script src="${ctxStatic}/sdlyfp/js/amazeui.min.js"></script>
    <script src="${ctxStatic}/sdlyfp/js/iscroll.js"></script>
    <script src="${ctxStatic}/sdlyfp/js/app.js"></script>
	<script>
	$(function(){
		// $(".tpl-left-nav-menu").find("li a").eq(0).addClass("active");
		
	var menuId = '${menuId }';
	if(menuId)
	{
		$(".tpl-left-nav-menu").find("#"+menuId).addClass("active");
	}
		
	})
	
	var message = "${message}";
	if(message)
	{
		var messageType = "${messageType}";
		msg(message,3000,messageType);
	}
	
	
	
	// 页面数据
	// 页面数据
var pageData = {
    // ===============================================
    // 首页
    // ===============================================
    'index': function indexData() {
    },
    // ===============================================
    // 图表页
    // ===============================================
    'chart': function chartData() {
        // ==========================
        // 百度图表A http://echarts.baidu.com/
        // ==========================

        var echartsC = echarts.init(document.getElementById('tpl-echarts-C'));


        optionC = {
            tooltip: {
                trigger: 'axis'
            },
            /* toolbox: {
                top: '0',
                feature: {
                    dataView: { show: true, readOnly: false },
                    magicType: { show: true, type: ['line', 'bar'] },
                    restore: { show: true },
                    saveAsImage: { show: true }
                }
            }, */
            /* legend: {
                data: ['完成量11', '总量22']
            }, */
            xAxis: [{
                type: 'category',
                data: [${mapRs.names}]
            }],
            yAxis: [{
                    type: 'value',
                    name: '进度',
                    axisLabel: {
                        formatter: '{value}(%)'
                    }
                },
            ],
            series: [
            	<c:if test="${category eq 'forest' or category eq 'tecClear'}">
            	{
                    name: '${mapRs.rate1Name}',
                    type: 'bar',
                    barGap:0,
                    data: [${mapRs.forestRates}],
                    itemStyle: {
                        normal: {
                            color: '#ff6600'
                        }
                    }
                },
                </c:if>
                {
                    name: '${mapRs.rate2Name}',
                    type: 'bar',
                    barGap:0,
                    data: [${mapRs.peopleRates}],
                    itemStyle: {
                        normal: {
                            color: '#1c7ab6'
                        }
                    }
                }
                <c:if test="${category eq 'tecClear' or category eq 'country'}">
                ,
            	{
                    name: '${mapRs.rate3Name}',
                    type: 'bar',
                    barGap:0,
                    data: [${mapRs.clearCountryRates}],
                    itemStyle: {
                        normal: {
                            color: '#ff6600'
                        }
                    }
                }
                </c:if>
            ]
        };

        echartsC.setOption(optionC);
    }
}
	
function querySubAreaDate(obj)
{
	var areaType = $(obj).find("option:selected").attr("areaType");
	$("#areaType").val(areaType);
	document.forms[0].submit();
}
</script>
</body>
</html>